// @ts-nocheck
import { useState, useEffect } from "react";
import {
  ScrollView,
  Text,
  TouchableOpacity,
  View,
  StyleSheet,
  Image,
} from "react-native";
import { getStorageData } from "utils";
import translate from "utils/translate";
type GoodsItem = {
  goodsName?: string;
  price?: string;
  unit?: string;
  id?: string;
  goodsCode?: string;
  weight?: string;
  limit?: string;
  discount_lv?: string;
  remark?: string;
  changePrice?: string;
  mode?: string;
  discount?: string;
  salePrice?: string;
};
export default ({ navigation }: RootStackScreenProps) => {
  const [item, setItem] = useState<
    | (Omit<RootStackParamList["addModel"], "index"> & {
        goodsList: GoodsItem[];
      })
    | null
  >();
  useEffect(() => {
    getStorageData("classList").then((classList) => {
      getStorageData("defaultGoods").then((value) => {
        if (value) {
          const currentItem = JSON.parse(classList)?.find(
            (current) => current.id == value
          );
          setItem(currentItem);
        }
      });
    });
  }, []);
  return (
    <>
      <Text
        style={{
          marginTop: 20,
          marginLeft: 20,
          fontSize: 20,
        }}
      >
        {item?.className}
      </Text>
      <ScrollView
        style={{
          flex: 1,
        }}
        contentContainerStyle={{
          alignItems: "center",
        }}
      >
        <TouchableOpacity
          style={{
            backgroundColor: "#fff",
            borderRadius: 10,
            width: "90%",
            marginTop: 10,
            padding: 10,
          }}
          onPress={() => {
            navigation.navigate("specification", {
              index: -1,
            });
          }}
        >
          <Text>
            {(0 + 1).toString().padStart(4, "0") +
              "#" +
              translate("main.TemporaryGoods")}
          </Text>
        </TouchableOpacity>
        {item?.goodsList?.map((current, index) => {
          return (
            <TouchableOpacity
              key={index}
              style={{
                backgroundColor: "#fff",
                borderRadius: 10,
                width: "90%",
                marginTop: 10,
                padding: 10,
              }}
              onPress={() => {
                navigation.navigate("specification", {
                  index,
                });
              }}
            >
              <Text>
                {(index + 2).toString().padStart(4, "0") +
                  "#" +
                  current.goodsName}
              </Text>
              {
                <View
                  style={{
                    flexDirection: "row",
                    justifyContent: "space-between",
                    marginTop: 20,
                  }}
                >
                  <Text style={{ color: "#8799a3" }}>
                    {translate("main.salePrice") + ":"}
                    <Text
                      style={{
                        color: "#e54d42",
                      }}
                    >
                      {"￥" + (current.salePrice || current.price)}
                    </Text>
                  </Text>
                  <Text>
                    {translate("calss.price") + ":"}
                    <Text
                      style={{
                        textDecorationLine: "line-through",
                      }}
                    >
                      {"￥" + current.price}
                    </Text>
                  </Text>
                </View>
              }
            </TouchableOpacity>
          );
        })}
      </ScrollView>
    </>
  );
};
const styles = StyleSheet.create({
  container: { flex: 1, backgroundColor: "#fff" },
  button: {
    backgroundColor: "#0A59F7",
    width: "50%",
    height: 50,
    // borderRadius: 16,
    alignItems: "center",
    justifyContent: "center",
    alignSelf: "center",
  },
});
